<template>
  <div style="background:#e2e2e2;padding-top:10px;width: 100%;height: 100%;overflow:hidden;">
    <div class="secBox">
      <div class="ltcCommonBox">
        <div class="contentBox">
          <div style="margin-bottom:10px;margin-top:10px;">
            <el-button
              @click="addOrEditCommit"
              type="add"
              icon='el-icon-receiving'
            >保 存</el-button>
            <el-button
              @click="$router.go(-1)"
              type="cancel"
              icon='el-icon-back'
            >取 消</el-button>
          </div>
          <el-form
            :model="{activeForm:activeForm}"
            ref='activeForm'
          >
            <el-table
              :data="activeForm"
              class="table"
            >
              <el-table-column
                align="left"
                label="名称"
                min-width="90px"
                prop="materialType"
              >
                <template #default='scope'>

                  <span>{{scope.row.materialsName}}</span>
                </template>
              </el-table-column>
              <el-table-column
                v-for="(item,index) in field.filter(d=> d.type == this.pageType)"
                :key="index"
                align="left"
                :minWidth="item.width ||'80px'"
                :prop="item.prop"
              >
                <template #header>
                  <span>
                    <span
                      v-if="item.rules && (item.rules instanceof Array? Boolean(item.rules.find(d=>d.required == true)):item.rules.required == true)"
                      style="color:red;"
                    >*</span>
                    {{item.name}}
                    <span
                      v-if="item.unit"
                      style="color:#999"
                    >({{item.unit}})</span>
                  </span>
                </template>
                <template #default='scope'>
                  <el-form-item
                    :prop="'activeForm.'+scope.$index+'.'+item.prop"
                    :rules="item.rules"
                    v-if="item.isHide?!item.isHide(scope.$index):true"
                  >
                    <el-select
                      v-if='item.kind == "select"'
                      placeholder="请选择"
                      v-model="scope.row[item.prop]"
                      @change="item.onChange?item.onChange(scope.$index,$event,scope.row):''"
                    >
                      <el-option
                        :key="z.itemValue"
                        :label="z.itemText"
                        :value="z.itemValue"
                        v-for="z in (typeof item.dict == 'function' ? item.dict(scope.$index,scope.row).filter(d=> d.isShow):item.dict)"
                      >
                      </el-option>
                    </el-select>
                    <mmSelect
                      :options="cropList"
                      v-model="scope.row.cropId"
                      v-else-if='item.kind == "multi-select"'
                    />
                    <seletVarity
                      v-else-if='item.kind == "select-varity"'
                      v-model="scope.row.variety"
                      :cropId="scope.row.cropId"
                      :mask="scope.row.mask"
                    >
                    </seletVarity>
                    <!-- <el-select
                      v-else-if='item.kind == "multi-select"'
                      placeholder="请选择"
                      multiple
                      collapse-tags
                      class="multiple"
                      clearable
                      v-model="scope.row[item.prop]"
                    >
                      <el-option
                        :key="z.itemValue"
                        :label="z.itemText"
                        :value="z.itemValue"
                        v-for="z in (typeof item.dict == 'function' ? item.dict():item.dict)"
                      >
                      </el-option>
                    </el-select> -->
                    <el-input
                      v-else-if='item.kind == "input"'
                      v-model="scope.row[item.prop]"
                      placeholder='请输入'
                      @input='item.onInput?item.onInput(scope.$index):""'
                    >
                      <el-select
                        v-if="item.slot && item.slot.type == 'unit'"
                        slot="append"
                        placeholder="请选择"
                        v-model="scope.row[item.slot.prop]"
                        @change="item.slot.onChange?item.slot.onChange(scope.$index,$event,scope.row):''"
                      >
                        <el-option
                          v-for="d in typeof item.slot.dict == 'function'? item.slot.dict(scope.$index).filter(d=> d.isShow):item.slot.dict"
                          :key="d.itemValue"
                          :label="d.itemText"
                          :value="d.itemValue"
                        >
                        </el-option>
                      </el-select>
                    </el-input>
                    <!-- <el-cascader
                      size="small"
                      v-else-if="item.kind=='cascader'"
                      style="width:280px"
                      :options="options"
                      @change="item.onChange($event,scope.row, scope.$index)"
                      v-model="scope.row[item.prop]"
                      :ref="'getNodes'+scope.$index"
                      class="checkbox270"
                      collapse-tags
                      expandTrigger="hover"
                      :props="props"
                      :show-all-levels="false"
                    ></el-cascader> -->
                    <mm-cascader
                      v-else-if="item.kind == 'cascader'&&options.length"
                      :options="options"
                      @change="handleChange(scope.row,$event)"
                      v-model="scope.row.serviceIdList"
                      :init.sync="scope.row.serviceName"
                    />

                    <template v-else-if="item.kind == 'list'">
                      <el-row
                        style="width:100%"
                        v-for="(a,ai) in scope.row[item.prop]"
                        :key='ai'
                      >
                        <template>
                          <el-col
                            :span='18/item.props.length'
                            v-for="child in item.props"
                            :key="child.name"
                          >
                            <el-form-item
                              :prop="'activeForm.'+scope.$index+'.'+item.prop+'.'+ai+'.'+child.prop"
                              :rules='child.rules'
                            >
                              <el-select
                                size='small'
                                v-if='child.kind == "select"'
                                placeholder="请选择"
                                v-model="scope.row[item.prop][ai][child.prop]"
                                @change='(e)=>child.onChange(e,scope.row[item.prop][ai])'
                              >
                                <el-option
                                  :key="z.itemValue"
                                  :label="z.itemText"
                                  :value="z.itemValue"
                                  v-for="z in typeof child.dict == 'function' ? child.dict(scope.row):child.dict"
                                >
                                </el-option>
                              </el-select>
                              <el-input
                                size='small'
                                v-else-if='child.kind == "input"'
                                v-model="scope.row[item.prop][ai][child.prop]"
                                placeholder='请输入'
                                @input='child.onInput?child.onInput(scope.$index):""'
                              >
                              </el-input>
                            </el-form-item>
                          </el-col>
                          <el-col
                            :span='6'
                            style="margin-top: 5px;"
                          >
                            <span
                              @click="item.delEle(ai,scope,item)"
                              class="delEleBtn"
                            >
                              <i class="el-icon-remove"></i>
                            </span>
                            <span
                              v-if="ai == scope.row[item.prop].length - 1 && scope.row[item.prop].length <=4"
                              @click="item.addEle(scope,item)"
                              class="addEleBtn"
                            >
                              <i class="el-icon-circle-plus"></i>
                            </span>
                          </el-col>
                        </template>
                      </el-row>
                    </template>
                    <span v-else>{{scope.row[item.prop] || '--'}}</span>
                  </el-form-item>
                  <span v-else>--</span>
                </template>
              </el-table-column>
            </el-table>
          </el-form>
        </div>
      </div>
    </div>
  </div>

</template>

<script>
import {
  getElementList,
  sysMaterialsList,
  nutritionEditDetail,
  plantProtectionEditDetail,
  tankEditDetail,
  seedEditDetail,
  addNutrition,
  addplantProtection,
  addTank,
  addSeed,
  cropsAll,
  delOrUpDown
} from "@/api/materiel.js";
import { get } from "@/api/http_utils.js";
import mmCascader from './mm-cascader'
import mmSelect from './mm-select'
import seletVarity from './selectVarity'
export default {
  components: {
    mmCascader,
    mmSelect,
    seletVarity
  },
  data() {
    return {
      props: { multiple: true },
      pageType: '',
      eleList: [],
      cropList: [],
      materielList: [],
      options: [],
      activeForm: [],
      field: [{
        prop: 'materialType',
        name: '分类',
        type: '0',
        kind: 'select',
        dict: [
          { itemText: '底肥原料', itemValue: 10 },
          { itemText: '液肥原料', itemValue: 20 },
          { itemText: '叶面肥', itemValue: 30 },
          { itemText: '黄腐酸', itemValue: 50 },
          { itemText: '有机肥', itemValue: 60 },
          { itemText: '其他', itemValue: 40 }],
        rules: {
          required: true,
          message: "请输入",
          trigger: "blur"
        }
      }, {
        prop: 'exFactoryPrice',
        name: '出厂价',
        type: '0',
        kind: 'input',
        unit: '元/吨或千升',
        onInput: (i) => {
          this.activeForm[i].costPrice = Number(Number(this.activeForm[i].transportPrice) + Number(this.activeForm[i].exFactoryPrice))
          this.activeForm[i].costUnitPrice = Number(this.activeForm[i].costPrice / 1000)
        },
        rules: [{
          required: true,
          message: "请输入",
          trigger: "blur"
        }, {
          type: "number",
          message: "请输入正数，最多三位小数",
          trigger: "blur",
          transform(val) {
            if (val != "" && val <= 0) {
              return false
            }
            var regex = /^\d+(\.\d{1,3})?$/g;
            if (val != "" && !regex.test(val)) {
              return false
            }
          }
        }]

      }, {
        prop: 'transportPrice',
        name: '运输价',
        type: '0',
        unit: '元/吨或千升',
        onInput: (i) => {
          this.activeForm[i].costPrice = Number(Number(this.activeForm[i].transportPrice) + Number(this.activeForm[i].exFactoryPrice))
          this.activeForm[i].costUnitPrice = Number(this.activeForm[i].costPrice / 1000)
        },
        kind: 'input',
        rules: [{
          required: true,
          message: "请输入",
          trigger: "blur"
        }, {
          type: "number",
          message: "请输入正数，最多三位小数",
          trigger: "blur",
          transform(val) {
            if (val !== "" && val < 0 && val != null) {
              return false
            }
            var regex = /^\d+(\.\d{1,3})?$/g;
            if (val != "" && !regex.test(val)) {
              return false
            }
          }
        }]
      }, {
        prop: 'costPrice',
        name: '成本价',
        type: '0',
        unit: '元/吨或千升',
        kind: 'default',
      }, {
        prop: 'costUnitPrice',
        name: '成本单价',
        type: '0',
        unit: '元/公斤或升',
        kind: 'default',
      }, {
        name: '物料养分',
        prop: 'elementList',
        type: '0',
        width: '120px',
        props: [{
          prop: 'name',
          name: '元素名称',
          kind: 'select',
          rules: { required: true, message: '请选择', trigger: 'change' },
          dict: () => {
            return this.eleList.map(d => {
              d.elementId = d.id;
              d.itemText = d.name
              d.itemValue = d.name
              d.isShow = true
              return d
            })
          },
          onChange: (el, item) => {
            item.elementId = this.eleList.find(d => d.name == el).id
          }
        }, {
          prop: 'amount',
          kind: 'input',
          name: '用量',
          rules: [{
            required: true,
            message: "请输入",
            trigger: "change",
          },
          {
            validator: (rule, value, callback) => {
              var regex = /^\d+(\.\d{1,3})?$/g;
              if (value == null || value == "") {
                callback();
              } else if (!regex.test(value)) {
                callback(new Error("请输入正确格式"));
              } else {
                callback();
              }
            },
            trigger: "change",
          }]
        }],
        unit: '元/公斤或升',
        kind: 'list',
        addEle: (scope, item) => {
          // 动态表单添加一行
          scope.row[item.prop].push({
            name: "",
            amount: "",
            elementId: ""
          });
        },
        delEle: (index, scope, item) => {
          // 动态表单删除一行
          if (scope.row[item.prop].length > 1) {
            scope.row[item.prop].splice(index, 1);
          } else {
            this.$message({
              message: "物料养分至少添加一条",
              type: "warning",
            });
          }
        },
        rules: {
          required: true, // 仅展示表头红星用
        },
      },
      // 植保字段
      {
        prop: 'materialType',
        name: '分类',
        type: '1',
        kind: 'select',
        dict: [
          { itemText: '杀菌剂', itemValue: 10 },
          { itemText: '除草剂', itemValue: 20 },
          { itemText: '杀虫剂', itemValue: 30 },
          { itemText: '杀螨剂', itemValue: 40 },
          { itemText: '杀线虫剂', itemValue: 50 },
          { itemText: '植物生长调节剂', itemValue: 60 },
          { itemText: '卫生药剂', itemValue: 70 },
          { itemText: '助剂', itemValue: 80 }],
        rules: {
          required: true,
          message: "请输入",
          trigger: "blur"
        }
      }, {
        prop: 'materielName',
        name: '适用作物',
        type: '1',
        kind: 'multi-select',
        width: '140px',
        // rules: { required: true, message: '请选择', trigger: 'change' },
        dict: () => {
          return this.cropList
        }
      }, {
        prop: 'target',
        name: '时期/靶标',
        type: '1',
        kind: 'input',
      }, {
        prop: 'costPrice',
        name: '成本价',
        type: '1',
        unit: '元/公斤或升',
        onInput: (i) => {
          this.activeForm[i].costUnitPrice = Number(this.activeForm[i].costPrice / 1000)
        },
        kind: 'input',
        rules: [{
          required: true,
          message: "请输入",
          trigger: "blur"
        }, {
          type: "number",
          message: "请输入正数，最多三位小数",
          trigger: "blur",
          transform(val) {
            if (val != "" && val <= 0) {
              return false
            }
            var regex = /^\d+(\.\d{1,3})?$/g;
            if (val != "" && !regex.test(val)) {
              return false
            }
          }
        }]
      }, {
        prop: 'costUnitPrice',
        name: '成本单价',
        type: '1',
        unit: '元/克或毫升',
        kind: 'default',
      }, {
        prop: 'guidePrice',
        name: '指导价',
        type: '1',
        unit: '元/公斤或升',
        onInput: (i) => {
          this.activeForm[i].guideUnitPrice = Number(this.activeForm[i].guidePrice / 1000)
        },
        kind: 'input',
        rules: [{
          required: true,
          message: "请输入",
          trigger: "blur"
        }, {
          type: "number",
          message: "请输入正数，最多三位小数",
          trigger: "blur",
          transform(val) {
            if (val != "" && val <= 0) {
              return false
            }
            var regex = /^\d+(\.\d{1,3})?$/g;
            if (val != "" && !regex.test(val)) {
              return false
            }
          }
        }]
      }, {
        prop: 'guideUnitPrice',
        name: '指导单价',
        type: '1',
        unit: '元/克或毫升',
        kind: 'default',
      },
      // 种子
      {
        prop: 'cropId',
        name: '作物',
        type: '2',
        kind: 'select',
        width: '80px',
        onChange: (index, value, row) => {
          console.log(value, this.cropList, '12222222222')
          let item = this.cropList.find(item => item.id == value)
          row.mask = item.mask
          console.log(item, '1222')
        },
        rules: { required: true, message: '请选择', trigger: 'change' },
        dict: () => {
          return this.cropList.map(d => {
            d.itemText = d.name
            d.itemValue = d.id
            d.isShow = true
            return d
          })
        }
      },
      {
        prop: 'variety',
        name: '品种',
        type: '2',
        kind: 'select-varity',
        width: '80px',
        rules: { required: true, message: '请选择', trigger: 'change' },
      }, {
        prop: 'supplier',
        name: '供应商',
        width: '120px',
        type: '2',
        kind: 'input',
      }, {
        prop: 'costPrice',
        name: '成本/指导价',
        width: '140px',
        type: '2',
        kind: 'input',
        rules: [{
          required: true,
          message: "请输入",
          trigger: "blur"
        }, {
          type: "number",
          message: "请输入正数，最多三位小数",
          trigger: "blur",
          transform(val) {
            if (val != "" && val <= 0) {
              return false
            }
            var regex = /^\d+(\.\d{1,3})?$/g;
            if (val != "" && !regex.test(val)) {
              return false
            }
          }
        }],
        onInput: (i) => {
          this.changeInfo(i)
        },
        slot: {
          type: 'unit',
          prop: 'costPriceUnit',
          onChange: (i) => {
            this.activeForm[i].unitOfUnitPrice = null
            this.activeForm[i].specification = null
            this.activeForm[i].specificationUnit = null
            this.activeForm[i].grainWeight = null
            this.activeForm[i].costUnitPrice = null
          },
          dict: [{
            itemText: '元/粒',
            itemValue: '元/粒'
          }, {
            itemText: '元/Kg',
            itemValue: '元/Kg'
          }, {
            itemText: '元/组',
            itemValue: '元/组'
          }, {
            itemText: '元/袋',
            itemValue: '元/袋'
          }]
        }
      }, {
        prop: 'unitOfUnitPrice',
        name: '单价单位',
        type: '2',
        kind: 'select',
        rules: { message: "请选择", required: true, trigger: "blur" },
        onChange: (i) => {
          this.activeForm[i].specification = null
          this.activeForm[i].specificationUnit = null
          this.activeForm[i].grainWeight = null
          this.activeForm[i].costUnitPrice = null
          this.changeInfo(i)
        },
        dict: (i) => {
          return [{
            itemText: '元/粒',
            itemValue: '元/粒',
            isShow: true
          }, {
            itemText: '元/Kg',
            itemValue: '元/Kg',
            isShow: this.activeForm[i].costPriceUnit == '元/Kg'
          }]
        }
      }, {
        prop: 'specification',
        name: '规格',
        type: '2',
        kind: 'input',
        isHide: (i) => {
          return !this.activeForm[i].costPriceUnit || !this.activeForm[i].unitOfUnitPrice || this.activeForm[i].costPriceUnit == this.activeForm[i].unitOfUnitPrice || (this.activeForm[i].costPriceUnit == '元/Kg' && this.activeForm[i].unitOfUnitPrice == '元/粒')
        },
        width: '140px',
        rules: [{
          required: true,
          message: "请输入",
          trigger: "blur"
        }, {
          type: "number",
          message: "请输入正数，最多三位小数",
          trigger: "blur",
          transform(val) {
            if (val != "" && val <= 0) {
              return false
            }
            var regex = /^\d+(\.\d{1,3})?$/g;
            if (val != "" && !regex.test(val)) {
              return false
            }
          }
        }],
        onInput: (i) => {
          this.changeInfo(i)
        },
        slot: {
          type: 'unit',
          prop: 'specificationUnit',
          onChange: (i) => {
            this.changeInfo(i)
          },
          dict: (i) => {
            return [{
              itemText: '粒/组',
              itemValue: '粒/组',
              isShow: this.activeForm[i].costPriceUnit == '元/组'
            }, {
              itemText: '粒/袋',
              itemValue: '粒/袋',
              isShow: this.activeForm[i].costPriceUnit != '元/组'
            }, {
              itemText: 'Kg/袋',
              itemValue: 'Kg/袋',
              isShow: this.activeForm[i].costPriceUnit != '元/组'
            }]
          }
        }
      }, {
        prop: 'grainWeight',
        name: '千粒重',
        unit: '克',
        type: '2',
        kind: 'input',
        isHide: (i) => {
          return !(this.activeForm[i].specificationUnit == 'Kg/袋' || (this.activeForm[i].costPriceUnit == '元/Kg' && this.activeForm[i].unitOfUnitPrice == '元/粒'))
        },
        rules: [{
          required: true,
          message: "请输入",
          trigger: "blur"
        }, {
          type: "number",
          message: "请输入正数，最多三位小数",
          trigger: "blur",
          transform(val) {
            if (val != "" && val <= 0) {
              return false
            }
            var regex = /^\d+(\.\d{1,3})?$/g;
            if (val != "" && !regex.test(val)) {
              return false
            }
          }
        }],
        onInput: (i) => {
          this.changeInfo(i)
        }

      }, {
        prop: 'costUnitPrice',
        name: '成本/指导单价',
        type: '2',
        width: '50px',
        kind: 'default',
      },
      // 泵罐
      {
        prop: 'costPrice',
        name: '成本价',
        type: '3',
        unit: '元/套',
        kind: 'input',
        rules: [{
          required: true,
          message: "请输入",
          trigger: "blur"
        }, {
          type: "number",
          message: "请输入正数，最多三位小数",
          trigger: "blur",
          transform(val) {
            if (val != "" && val <= 0) {
              return false
            }
            var regex = /^\d+(\.\d{1,3})?$/g;
            if (val != "" && !regex.test(val)) {
              return false
            }
          }
        }]
      },
      {
        prop: 'serviceName',
        name: '适用中心',
        type: '3',
        kind: 'cascader',
        onChange: (value, index) => {

        },
        rules: [
          {
            required: true,
            message: "请选择中心",
            trigger: "change"
          }
        ]
      }
      ],
    }
  },
  mounted() {
    this.pageType = this.$route.query.type
    if (this.pageType == 3) {
      this.getCascaderData()
    }
    if (this.pageType == 0) {
      getElementList().then((data) => {
        this.eleList = data.data.data;
        this.eleList.map((item) => {
          item.elementName = item.name;
          item.elementId = item.id;
          item.disabled = false;
        });
      });
    } else if (this.pageType == 1 || this.pageType == 2) {
      cropsAll().then((data) => {
        this.cropList = data.data.data;
      });
    }
    sysMaterialsList(13001).then((data) => {
      this.materielList = data.data.data;
    });
    if (this.pageType == 0) {
      nutritionEditDetail(this.$route.query.id).then((res) => {
        this.activeForm = res.data.data.map(d => {
          if (d.elementList == null || d.elementList.length == 0) {
            d.elementList = [{
              name: "",
              amount: "",
            },]
          }
          Object.assign(d, { exFactoryPrice: '', transportPrice: '', costUnitPrice: '', costPrice: '', })
          return d
        })
      });
    } else if (this.pageType == 1) {
      plantProtectionEditDetail(this.$route.query.id).then((res) => {
        this.activeForm = res.data.data.map(d => {
          d.cropId = d.cropId ? d.cropId.split(',') : []
          return d
        })
      })
    } else if (this.pageType == 2) {
      seedEditDetail(this.$route.query.id).then((res) => {
        this.activeForm = res.data.data
      })
    } else if (this.pageType == 3) {
      tankEditDetail(this.$route.query.id).then((res) => {
        this.activeForm = res.data.data.map((item) => {
          this.$set(item, 'serviceIdList', [])
          return item
        })
      })
    }
  },
  methods: {
    handleChange(row, value, llll) {
      console.log(value, llll, '111', row)
    },
    allOrOtherCenter(val, oldName, newName, node, isUse) {
      let oldVal = this[oldName]
      let i = null
      let bool = oldVal.some((item, index) => {
        let b = item[0] == '全部'
        if (b) i = index
        return b
      })
      if (bool && val.length > oldVal.length) {
        // this.serviceValue = val
        this[newName].shift()
        let arry = this.$refs[node].getCheckedNodes()
        arry[0].checked = false
        this[oldName] = this[newName]
        if (isUse) this.getRes(1)
        return
      }
      let nbool = val.some(item => item[0] == '全部')
      if (!bool && nbool && val.length > oldVal.length) {
        this[newName] = [['全部']]
        this[oldName] = this[newName]
        if (isUse) this.getRes(1)
        return
      }
      this[oldName] = val
      if (isUse) this.getRes(1)
    },
    changeInfo(i) {
      if (this.activeForm[i].costPriceUnit == this.activeForm[i].unitOfUnitPrice && this.activeForm[i].costPriceUnit && this.activeForm[i].unitOfUnitPrice) {
        this.activeForm[i].costUnitPrice = Number(Number(this.activeForm[i].costPrice).toFixed(6))
      } else if (this.activeForm[i].costPriceUnit == '元/Kg' && this.activeForm[i].unitOfUnitPrice == '元/粒') {
        this.activeForm[i].costUnitPrice = Number(Number(this.activeForm[i].costPrice * this.activeForm[i].grainWeight / 1000000).toFixed(6))
      } else if (this.activeForm[i].costPriceUnit == '元/组' && this.activeForm[i].unitOfUnitPrice == '元/粒' && this.activeForm[i].specificationUnit == '粒/组') {
        this.activeForm[i].costUnitPrice = Number(Number(this.activeForm[i].costPrice / this.activeForm[i].specification).toFixed(6))
      } else if (this.activeForm[i].costPriceUnit == '元/袋' && this.activeForm[i].unitOfUnitPrice == '元/粒' && this.activeForm[i].specificationUnit == '粒/袋') {
        this.activeForm[i].costUnitPrice = Number(Number(this.activeForm[i].costPrice / this.activeForm[i].specification).toFixed(6))
      } else if (this.activeForm[i].costPriceUnit == '元/袋' && this.activeForm[i].unitOfUnitPrice == '元/粒' && this.activeForm[i].specificationUnit == 'Kg/袋') {
        this.activeForm[i].costUnitPrice = Number(Number(this.activeForm[i].costPrice / this.activeForm[i].specification * this.activeForm[i].grainWeight / 1000000).toFixed(6))
      }
    },
    getCascaderData: function () {
      get('/servicePlan/busService/list').then(({ data }) => {
        console.log("获取新的分类数据", data);
        data.unshift({
          name: '全部',
          serviceList: [{
            name: '全部',
            id: null
          }
          ]
        })
        const info = data
        this.options = info.map((v) => {
          let obj = {
            value: v.name,
            label: v.name,
          }
          if (v.name != '全部') {
            this.$set(obj, 'children', v.serviceList.map((v2) => ({
              value: v2.id,
              label: v2.name,
            })))
          }
          return obj
        })
      });
    },
    async addOrEditCommit() {
      let flag = false
      let valid = null
      await this.$refs["activeForm"].validate(async (v, errform) => {
        if (!v) return
        let valid = v
        if (valid) {
          let action = ''
          await this.$confirm('是否将物料上架', '提示', {
            distinguishCancelAndClose: true,
            confirmButtonText: '是',
            cancelButtonText: '否',
            type: 'warning'
          }).then(() => {
            flag = true
          }).catch(a => {
            action = a
          })
          if (action == 'close') {
            return false
          }
          let commitData = JSON.parse(JSON.stringify(this.activeForm));
          if (this.pageType == 0) {
            await addNutrition(commitData).then((data) => {
              if (data.data.code == 0) {
                if (!flag) {
                  this.$message({
                    message: "操作成功",
                    type: "success",
                  });
                  this.editVisible = false;
                  this.$router.go(-1)
                }
              }
            });
          } else if (this.pageType == 1) {
            commitData.map(d => {
              if (d.cropId.includes('')) {
                d.cropId.shift()
              }
              d.cropId = d.cropId.join(',')
            })
            await addplantProtection(commitData).then((data) => {
              if (data.data.code == 0) {
                if (!flag) {
                  this.$message({
                    message: "操作成功",
                    type: "success",
                  });
                  this.editVisible = false;
                  this.$router.go(-1)
                }
              }
            })
          } else if (this.pageType == 2) {
            let flag = true
            for (let i = 0; i < commitData.length; i++) {
              let d = commitData[i]
              if (d.costPrice && !d.costPriceUnit) {
                this.$message.error('请选择' + d.materialsName + (d.cropName.includes('玉米') ? '指导价' : '成本价') + '单位')
                flag = false
                return
              } else if (d.specification && !d.specificationUnit) {
                flag = false
                this.$message.error('请选择规格单位')
                return
              }
            }
            commitData.forEach(d => {
            });
            if (!flag) {
              return
            }
            await addSeed(commitData).then((data) => {
              if (data.data.code == 0) {
                if (!flag) {
                  this.$message({
                    message: "操作成功",
                    type: "success",
                  });
                  this.editVisible = false;
                  this.$router.go(-1)
                }
              }
            })
          } else if (this.pageType == 3) {
            await addTank(commitData).then((data) => {
              if (data.data.code == 0) {
                if (!flag) {
                  this.$message({
                    message: "操作成功",
                    type: "success",
                  });
                  this.editVisible = false;
                  this.$router.go(-1)
                }
              }
            })
          }
          if (flag) {
            let res = await delOrUpDown({ batchPutOnOrDelDTOList: commitData.map(d => { return { id: d.id, putOnState: 1 } }), type: 1 })
            if (res.data.code == 0) {
              this.$message({
                message: "操作成功",
                type: "success",
              });
              this.editVisible = false;
              this.$router.go(-1)
            }
          }
        }
      })

    }
  }
}
</script>

<style lang="scss" scoped>
@import "~@/styles/ltcCommon.scss";
.secBox {
  margin: 0 auto 0;
  width: 95.5%;
  height: calc(100vh - 65px);
  overflow-y: scroll;
  border-radius: 4px;
  background: #ffffff;
  padding-left: 20px;
  padding-right: 15px;
}
.contentBox {
  padding-bottom: 20px;
}
/deep/ {
  .el-col {
    padding-top: 10px;
    .el-input,
    .el-input--small,
    .el-select--small {
      width: 95% !important;
      margin-left: 2.5%;
    }
  }

  .el-tag {
    height: 18px;
  }
  .el-select .el-input {
    width: 95% !important;
  }
  .el-select__tags {
    max-width: auto !important;
  }
  .el-form-item {
    padding-top: 5px;
  }

  .el-input-group__append {
    max-width: 85px;
    .el-input {
      width: 85px !important;
    }
  }
}
</style>